<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <link rel="SHORTCUT ICON" href="favicon.ico">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" >
    <title>品格图床 | 免登陆图床</title>
    <link rel="shortcut icon" href="favicon.ico">

    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">

    <script src="js/jquery.min.js"></script>

    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>

    <!-- axios插件 -->
    <script src="js/axios.min.js"></script>

    <link rel="stylesheet" href="css/main.css" >
    <link rel="stylesheet" href="css/bs4.pop.css" >
    <link rel="stylesheet" href="css/mobile.css" >
    <link rel="stylesheet" href="css/show.css" >

    <!-- 设置全局a打开新标签页-->
<!--    <base target="_blank" />-->
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <div class="container">
            <a class="navbar-brand" href="/"><img src="favicon.ico" style="height: 25px">&nbsp;品格图床</a>

            <button id="toggler-navbar" class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
                <span class="navbar-toggler-icon"></span>
            </button>


            <div class="collapse navbar-collapse" id="collapsibleNavbar">
                <ul class="navbar-nav">
                    <li class="nav-item active"><a class="nav-link" href="/">上传</a></li>
                    <li class="nav-item"><a class="nav-link" href="/history">历史</a></li>
                    <li class="nav-item"><a class="nav-link" href="/admin">管理</a></li>
                </ul>
            </div>
        </div>
    </nav>

    <div class="site">
        <div class="site-inner">
            <div class="cover-container">
                <div class="cover-inner">
                    <h1 style="color: white">永久免费丨免登陆图床</h1>
                    <p class="lead" style="color: white">请点击按钮上传 <br>
                    图片不会被压缩,不限制外链,永久保存 <br>
                    开发时长两年半的个人图床<img src="doge.png" height="25px"></p>

                    <p style="color: white">图片大小限制: <span th:text="${uploadSize}" ></span><br>
                        已为用户保存: <span th:text="${uploadImageCount}"></span>张图片<br>
                        服务器剩余空间: <span th:text="${freeSize}"></span>GB</p>

                    <p style="color: white">
                        <a href="javascript:void(0)" class="btn btn-light" id="selectButton">选择文件</a>
                        <input type="file" name="file" formenctype="multipart/form-data" style="display: none" multiple="multiple" id="upload" accept="image/jpg,image/jpeg,image/png,image/gif,image/svg,image/svg+xml,application/x-bmp,image/x-icon,application/x-ico,image/tiff">
                    </p>

                    <span style="color: white" class="remind"></span>

                    <div class="progress" style="height: 2px">
                        <div class="progress-bar" id="test"></div>
                    </div>


                    <section class="dialog-select" id="selectFile">
                        <div class="dialog-header">
                            <p>上传图片<img class="dialog-close" src="close.png"></p>
                        </div>
                        <div class="dialog-body">
                            <div class="upload-method">
                                <a href="javascript:void(0)" class="header-upload selected" id="local-upload">本地上传</a>
                                <a href="javascript:void(0)" class="header-clone" id="clone">URL上传</a>
                            </div>
                            <div class="upload-file upload-area"><a id="select"><img src="add.png"></a></div>
                            <div class="clone-file upload-area " style="display: none"><textarea id="cloneArea" class="form-control" style="margin-top: 20px; resize: none" rows="10" placeholder="请将网址输入完全, 例如http://www.test.com/abc.jpg"></textarea></div>
                            <button type="button" onclick="upload()" class="btn btn-secondary" id="uploadFile">上传文件</button>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>

    <script src="js/bs4.pop.js"></script>
    <script src="js/main.js"></script>
    <script src="js/go.js"></script>
    <script src="js/click.js"></script>
</body>
</html>